<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html lang="zn">
<head>
    <title>修改密码</title>
</head>
<script type="text/javascript" src="js/jquery-1.10.2.js"></script>
<style>
    #grxx{
        background-color:whitesmoke;
        width: 900px;
        height: 600px;
        margin-left: 200px;
        margin-top: -100px;
    }
    .sz{
        margin-left: 100px;

        padding-top: 40px;
    }
    .person-tab{
        margin-left: 150px;
        padding-left: 20px;
    }
    a{
        text-decoration: none;
        color: black;
    }
    .jbxx-xian{
        background-color:red;
        width: 100px;
        height: 3px;
        margin-left: 150px;
        margin-top:-10px;
        display: none;
    }
    .xgmm-xian{
        background-color:red;
        width: 100px;
        height: 3px;
        margin-left: 320px;
        margin-top:-10px;
    }
    .konglong{
        margin-left: 130px;
        margin-top: 50px;
        border:solid 3px yellow;
    }
    .xgjbxx-href{
        margin-left:170px;
        margin-top: 100px;
        color:lightseagreen;
    }

.update-word{
    width: 545px;
    height: 400px;
    border: 3px dotted pink;
    padding-left: 350px;
    margin-top: -220px;

}
    .yes{
        width: 30px;
        height: 30px;
        display: none;
    }
    .no{
        width: 30px;
        height: 30px;
        display: none;
    }
.new-word{
    position: absolute;
    margin-top: -15px;
}
.qr{
    margin-top: 40px;
}
    .qr-word{
        position: absolute;
        margin-top: -20px;
    }
    .btn{
       position: absolute;
       margin-top: 10px;
        margin-left: 90px;
        color: #fff;
        background-color: #FF5A44;
        border-color: #FF5A44;
        text-shadow: 0 -1px 0 rgba(0,0,0,0.12);
        -webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.045);
        box-shadow: 0 2px 0 rgba(0,0,0,0.045);
        width: 100px;
        height: 50px;
    }
    h6{

        margin-left: 10px;

        margin-top: 1px;
    }
    .update-tab{
        margin-top: 10px;
        text-align: center;
        margin-left: -20px;
        background-color: darkslategray;
        width: 300px;
        height: 300px;
        border: 2px solid lawngreen;
    }
    .update-tab tr td{
        text-align:center;
        vertical-align:middle;
    }
    .left-grzy{
        position: absolute;
        width: 190px;
        height: 500px;
        background: lightseagreen;
        text-align: center;
        padding-top: 5px;
    }
    a{
        text-decoration: none;
    }
    .right{
        transition: margin 0.5s ease-out;
        -webkit-transition: margin 0.5s ease-out;
        -moz-transition: margin 0.5s ease-out;
        -khtml-transition: margin 0.5s ease-out;
    }
    .right:hover{
        margin-left: 50px;
    }
</style>
<script>
    $(function () {
        $("#xgmm").click(function () {
            $(".xgmm-xian").css("display","");
            $(".jbxx-xian").css("display","none");
        })
        $("#jbxx").click(function () {
            $(".xgmm-xian").css("display","none");
            $(".jbxx-xian").css("display","");
        })
    })
</script>
<body scroll="no" style="overflow-x:hidden; background: darkslategray">
<%@include file="tou.jsp"%>
<%@include file="zhong.jsp"%>
<!--左边-->
<div class="left-grzy">
    <a href="personal.jsp"><h3 style="color: white">个人主页</h3></a>
    <hr/>
    <h3 style="color:rgba(255,255,255,0.5)">我是考生</h3>
    <a href="##"><h6 class="right" style="color: white">竞赛</h6></a>
    <a href="##"> <h6 class="right" style="color: white">考试</h6></a>
    <a href="##"><h6 class="right" style="color: white">答题</h6></a>
    <hr/>
    <h3 style="color:rgba(255,255,255,0.5)">我是考官</h3>
    <a href="##"><h6 class="right" style="color: white">出试卷</h6></a>
    <a href="##"> <h6 class="right" style="color: white">出单题</h6></a>
    <a href="##"><h6 class="right" style="color: white">出问卷</h6></a>
    <hr/>
    <a href="work.jsp"><h3 class="right" style="color: white">作业情况查询</h3></a>
</div>

<div id="grxx">
    <h1 class="sz">设置</h1>
    <div class="person-tab">
        <a href="personal.jsp" id="jbxx">基本信息</a>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="update-personal.jsp" id="xgmm">修改个人信息</a>
    </div>
    <hr/>
    <!--隐藏线-->
    <div class="jbxx-xian">
    </div>
    <div class="xgmm-xian">
    </div>

    <!--左半边-->
    <div>
        <img src="img/konglong.jpg" width="150px" height="150px" class="konglong"/>
    </div>
    <a href="personal.jsp" class="xgjbxx-href">查看基本信息>></a>


    <!--右半边-->
    <div class="update-word">
                <c:forEach items="${slist}" var="i" >
                <form action="personal/update?id=${i.uid}" method="post">
                <table  class="update-tab">
                        <tr>
                        <td><h3 style="color:rgba(255,255,255,0.5)">用户名：</h3></td>
                        <td><h3  style="color: white"><input name="uname" type="text" placeholder="请输入用户名" value="${i.uname}"></h3></td>
                    </tr>
                    <tr>
                        <td><h3 style="color:rgba(255,255,255,0.5)">密码：</h3></td>
                        <td><h3 style="color: white"><input type="text" name="upass" placeholder="请输入密码" value="${i.upass}"></h3></td>
                    </tr>
                </table>
                <input type="submit"  class="btn" value="修改" />
                </form>
                </c:forEach>
    </div>
</div>
<%@include file="wei.jsp"%>
</body>
</html>
